<template>
  <Row class="footer" :gutter="32">
    <Col span="8">
      <h3>介绍</h3>
      <p style="text-indent:2em;">
        网上购物正适应了当今社会快节奏的生活，使顾客足不出户便可以方便快捷轻松的选购自己喜欢的商品。商城主要包括零食小铺食品展示，按照类别管理食品。对于消费者来说，避免他们盲目在互联网上寻求和购买食品。可以在家里逛商店，订单不受时间限制；获得大量的食品信息，可以买到当地没有的食品；
      </p></Col
    >
    <Col span="8">
      <h3>关于</h3>
      <ul>
        <li v-for="item in about">{{ item }}</li>
      </ul></Col
    >
    <Col span="8">
      <div class="icons">
        <Icon type="ios-chatbubbles" color="#fff" size="20" />
        <Icon type="logo-github" color="#fff" size="20" />
        <Icon type="logo-twitter" color="#fff" size="20" />
      </div>
      <br />
      <img src="" alt=""
    /></Col>
  </Row>
</template>

<script>
export default {
  data() {
    return {
      about: ["新闻", "投资", "招纳贤士", "关于我们"]
    };
  }
};
</script>

<style lang="scss" scoped>
.footer {
  height: 250px;
  margin-top: 120px;
  padding: 20px 30px;
  background: #933;
  color: #fff;
  .icons {
    & > * {
      margin: 10px 10px;
    }
  }
  ul {
    li {
      list-style: none;
      margin: 10px 0;
      cursor: pointer;
    }
  }
}
</style>
